<include file="Public:header" />
<include file="Public:leftside" />

<style>
	.file-item{float: left;position: relative;margin: 0 20px 20px 0;padding: 4px;background: #000;}
	#imgLogo,#imgLogo1,#imgLogo2{max-height: 60px;}
	.ee_span{background: #eee;height: 35px;display: block;line-height: 35px;padding-left: 9px;}
	.class-logo p{width: 120px;height: 60px;line-height: 0;background-color: #FFF;text-align: center;vertical-align: middle;display: table-cell;overflow: hidden;margin: 0 0 10px;border: dashed 1px #E6E6E6;}
	.ncsc-upload-btn{vertical-align: top;display: inline-block;width: 80px;height: 30px;margin: 5px 5px 0 0;background: #c7c7c7;text-align: center;line-height: 30px;}
	.ncsc-upload-btn a{display: block;position: relative;z-index: 1;}
	.ncsc-upload-btn span{width: 80px;height: 30px;position: absolute;left: 0;top: 0;z-index: 2;cursor: pointer;}
	.ncsc-upload-btn .input-file{width: 80px;height: 30px;padding: 0;margin: 0;border: none 0;opacity: 0;filter: alpha(opacity=0);cursor: pointer;line-height: 20px;background-color: #FBFBFB;}
	.template ul .select{border: 3px solid red;}
	.template ul li{float: left;list-style: none;margin: 0 5px;border: 3px solid #fff;width: 110px;position: relative;}
	.template ul li img{float: left;}
	.template ul li span{float: left;text-align: center;margin: 2px 0;width: 100%;}
	.template ul li i{position: absolute; bottom: 0.8px;right: 0px;bottom:0;width: 12px;height: 12px; overflow: hidden;display: block;background: url(/themes/wnsc/Public/images/goods-icon.png) no-repeat;background-position: 0px -20px;}
	.url_banner{position: relative;left: -28px;}

</style>
<div class="main-content">
	<div class="breadcrumbs breadcrumbs-fixed" id="breadcrumbs">
		<ul class="breadcrumb">
			<li> <i class="icon-home home-icon"></i>
				<a href="#">首页</a>
			</li>
			<li>
				<a href="{:U('Store/template')}">模版设置</a>
			</li>

		</ul>
	</div>
	<div class="page-content" style="padding: 0;border: none;">

		<form action="{:U('Store/template_save')}" method="post" class="form form-horizontal" role="form">
			<div class="panel-body" style="padding: 0;border: none;">

				<div class="tab-content" style="padding: 16px 12px 55px 12px;">
					<div class="row panel-body">
						<a href="{:U('Store/info')}" class="btn btn-sm btn-default">基本信息</a>
						<a href="{:U('Store/template')}" class="btn btn-sm btn-primary">模版设置</a>
					</div>
					<section class="panel-default m-b-sm" style="margin:5px 0;">
						<div class="alert alert-info">
							<p>
								<i class="fa fa-hand-o-right m-r-xs"></i><strong>操作提示</strong>
							</p>
							<p class="alert-p m-l-xl"><i class="fa fa-caret-right m-r-xs"></i>该页面可对店铺模版设置进行编辑修改操作。</p>
						</div>
					</section>
					<div class="tab-pane fade active in" id="apply">
						<section class="panel panel-default">
							<header class="panel-heading font-bold"> 基本信息 </header>
							<div class="panel-body">

								<div class="form-group">
									<label class="col-sm-2 control-label">店铺logo</label>
									<div class="col-md-5">
										<div class="class-logo">
											<p><img id="imgLogo" src="{$store_template_info.logo}"></p>
										</div>
										<div class="ncsc-upload-btn">
											<a href="javascript:void(0);"><span>
			          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
			        <input type="hidden"id="Logo" name="logo" value="{$store_template_info.logo}"/></span>
												<p>
													<!-- <i class="icon-upload-alt"></i> -->上传图片</p>
											</a>
										</div>
										<p class="hint"><br><span style="color:orange;">建议使用宽120像素-高60像素图片；点击下方"提交"按钮后生效。</span></p>
									</div>
								</div>
								<div class="line line-dashed line-lg pull-in"></div>
								<div class="form-group">
									<label class="col-sm-2 control-label">横幅</label>
									<div class="col-md-9">
										<div class="class-logo">
											<p style="width: 1900px;"><img id="imgLogo1" src="{$store_template_info.banner}"></p>
										</div>
										<div class="ncsc-upload-btn">
											<a href="javascript:void(0);"><span>
			          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg1" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
			        <input type="hidden"id="Logo1" name="banner" value="{$store_template_info.banner}"/></span>
												<p>
													<!-- <i class="icon-upload-alt"></i> -->上传图片</p>
											</a>
										</div>
										<p class="hint"><br><span style="color:orange;">建议使用宽1900像素-高60像素图片；点击下方"提交"按钮后生效。</span></p>
									</div>
								</div>
								<div class="line line-dashed line-lg pull-in"></div>
								<div class="form-group">
									<label class="col-sm-2 control-label">店铺头像</label>
									<div class="col-md-5">
										<div class="class-logo">
											<p><img id="imgLogo2" src="{$store_template_info.portrait}"></p>
										</div>
										<div class="ncsc-upload-btn">
											<a href="javascript:void(0);"><span>
			          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg2" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
			        <input type="hidden"id="Logo2" name="portrait" value="{$store_template_info.portrait}"/></span>
												<p>
													<!-- <i class="icon-upload-alt"></i> -->上传图片</p>
											</a>
										</div>
										<p class="hint"><br><span style="color:orange;">建议使用宽230像素-高140像素图片；点击下方"提交"按钮后生效。</span></p>
									</div>
								</div>

								<div class="line line-dashed line-lg pull-in"></div>
								<div class="form-group">
									<label class="col-sm-2 control-label">模版设置</label>
									<div class="col-md-3 template">
										<ul>
											
											<foreach name="data" item="v">
												<li data="{$v.file_name}"  <eq name="store_template_info.template" value='$v["file_name"]'>class="select"</eq>>
													<img src="{$v.template_image}" style="width: 100px;height: 150px;"/>
													<span>{$v.name}</span>
													<eq name="store_template_info.template" value='$v["file_name"]'><i></i></eq>
													
												</li>
											</foreach>
										</ul>
									</div>
								</div>
								<input type="hidden" name="template" id="choose_template" value="{$store_template_info.template}" />
								<div class="line line-dashed line-lg pull-in"></div>
								<div class="form-group">
									<label class="col-sm-2 control-label">幻灯片</label>
									<div class="col-md-10">
										<div class="col-md-2">
											<div class="class-logo">
												<p><img id="imgLogo3" src="{$banners[0]}" style="max-height:60px;"></p>
											</div>
										<div class="url_banner">	URL:<input type="text" name="url1" id="url1" value="{$url[0]}" /></div>
											<div class="ncsc-upload-btn">
												<a href="javascript:void(0);"><span>
				          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg3" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
				        <input type="hidden"id="Logo3" name="banner1" value="{$banners[0]}"/></span>
													<p>上传图片</p>
												</a>
											</div>
										</div>
										<div class="col-md-2">
											<div class="class-logo">
												<p><img id="imgLogo4" src="{$banners[1]}" style="max-height:60px;"></p>
											</div>
											<div class="url_banner">URL:<input type="text" name="url2" id="url2" value="{$url[1]}" /></div>
											<div class="ncsc-upload-btn">
												<a href="javascript:void(0);"><span>
				          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg4" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
				        <input type="hidden"id="Logo4" name="banner2" value="{$banners[1]}"/></span>
													<p>上传图片</p>
												</a>
											</div>
										</div>
										<div class="col-md-2">
											<div class="class-logo">
												<p><img id="imgLogo5" src="{$banners[2]}" style="max-height:60px;"></p>
											</div>
										<div class="url_banner">	URL:<input type="text" name="url3" id="url3" value="{$url[2]}" /></div>
											<div class="ncsc-upload-btn">
												<a href="javascript:void(0);"><span>
				          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg5" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
				        <input type="hidden"id="Logo5" name="banner3" value="{$banners[2]}"/></span>
													<p>上传图片</p>
												</a>
											</div>
										</div>
										<div class="col-md-2">
											<div class="class-logo">
												<p><img id="imgLogo6" src="{$banners[3]}" style="max-height:60px;"></p>
											</div>
											<div class="url_banner">URL:<input type="text" name="url4" id="url4" value="{$url[3]}" /></div>
											<div class="ncsc-upload-btn">
												<a href="javascript:void(0);"><span>
				          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg6" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
				        <input type="hidden"id="Logo6" name="banner4" value="{$banners[3]}"/></span>
													<p>上传图片</p>
												</a>
											</div>
										</div>
										<div class="col-md-2">
											<div class="class-logo">
												<p><img id="imgLogo7" src="{$banners[4]}" style="max-height:60px;"></p>
											</div>
											<div class="url_banner">URL:<input type="text" name="url5" id="url5" value="{$url[4]}" /></div>
											<div class="ncsc-upload-btn">
												<a href="javascript:void(0);"><span>
				          <input hidefocus="true" size="1" class="input-file" name="file_upload" id="uploadImg7" nc_type="change_store_label" type="file" onchange="imgUpload(this);">
				        <input type="hidden"id="Logo7" name="banner5" value="{$banners[4]}"/></span>
													<p>上传图片</p>
												</a>
											</div>
										</div>
										<p class="hint" style="width: 100%;float: left;">
											<br><span style="color:orange;">
											建议使用宽1920像素-高400像素内的GIF或PNG透明图片；点击下方"提交"按钮后生效。</span>
										</p>
									</div>
								
								</div>
								
							</div>
						</section>

						<div class="col-sm-4 col-sm-offset-2" style="margin-top: 10px;">
							<button class="formSubmit btn btn-primary btn-sm" id="form" value="保存" ajax="1" type="button">保存</button> &nbsp; &nbsp; &nbsp;
							<button class="btn btn-primary btn-sm btn-danger" value="取消" type="button" onclick="history.back(-1);">取消</button>
						</div>
					</div>
				</div>
			</div>

		</form>
	</div>
	<script src="/Store/js/webupload/ajax_file_upload.js" type="text/javascript" charset="utf-8"></script>
	<script src="/Store/js/webupload/file_upload.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	/**
 *图片上传
 */
function imgUpload(event) {
	var fileid = $(event).attr("id");
	var str = $(event).next().attr("id");
	var formdata = new FormData(); 
	var v_this = $(event); 
	var fileObj = v_this.get(0).files;  
	formdata.append("imgFile", fileObj[0]);
	uploadFile(fileid,formdata,function(res){
		if(res.code==1){
			$("#img"+str).attr("src",res.saveURL);
			$("#"+str).val(res.saveURL);
		}
		layer.alert(res.state)
	});
}
$(function(){
	$('.template ul li').click(function(){
		$('.template ul li').removeClass('select');
		$('.template ul li i').remove();
		$(this).addClass('select');
		$(this).append('<i></i>');
		var template=$(this).attr('data');
		$('#choose_template').val(template);
	})
})
</script>
</script>
	<include file="Public:footer" />